<template>
<!-- 首页 -->
<div class="LogisticsList" element-loading-background="rgba(255, 255, 255, 0.4)">
    <el-row :gutter="30" class="main-el-row">
        <el-col :span="12" class="main-el-col">
            <div class="main-body">
              <span class="mian-span">原料进出明细</span>
            </div>
            <div class="main-body">
              <hy-table
                :height="autoHeightTable"
                fixed="right"
                tableIndex="序号"
                :editState="false"
                :page-small="false"
                :button="{edit: false, look: false}"
                :filter="filter"
                :titleData="titleData"
                :data="data"
                :pageState="false"
                :checkbox="false"
                type="multipleTable"
                >
              </hy-table>
            </div>
        </el-col>
        <el-col :span="12" class="main-el-col">
            <div class="main-body">
              <span class="mian-span">成品进出明细</span>
            </div>
            <div class="main-body">
              <hy-table
                :height="autoHeightTable"
                fixed="right"
                tableIndex="序号"
                :editState="false"
                :page-small="false"
                :button="{edit: false, look: false}"
                :filter="filter"
                :titleData="titleData"
                :data="data"
                :pageState="false"
                :checkbox="false"
                type="multipleTable"
                >
              </hy-table>
            </div>
        </el-col>
        <el-col :span="12" class="main-el-col">
            <div class="main-body">
              <span class="mian-span">原料库存信息</span>
            </div>
            <div class="main-body">
              <hy-table
                :height="autoHeightTable"
                fixed="right"
                tableIndex="序号"
                :editState="false"
                :page-small="false"
                :button="{edit: false, look: false}"
                :filter="filter"
                :titleData="titleData"
                :data="data"
                :pageState="false"
                :checkbox="false"
                type="multipleTable"
                >
              </hy-table>
            </div>
        </el-col>
        <el-col :span="12" class="main-el-col">
            <div class="main-body">
              <span class="mian-span">待处理</span>
            </div>
            <div class="main-body">
              <hy-table
                :height="autoHeightTable"
                fixed="right"
                tableIndex="序号"
                :editState="false"
                :page-small="false"
                :button="{edit: false, look: false}"
                :filter="filter"
                :titleData="titleData"
                :data="data"
                :pageState="false"
                :checkbox="false"
                type="multipleTable"
                >
              </hy-table>
            </div>
        </el-col>
    </el-row>
</div>
</template>

<script>
export default {
  components: {
  },
  computed: {
    autoHeightTable () {
      return (document.documentElement.scrollHeight - 251 -45)/2
    }
  },
  data () {
      return {
          searchTitle: [
              {type: 'input', name: 'customProductName', label: '输入搜索', placeholder: '请输入成品名称', prop: 'customProductName'},
              {type: 'input', name: 'customProductNo', label: '输入编号', placeholder: '请输入成品编号', prop: 'customProductNo'},
              {type: 'date2', name: 'issuanceDate', label: '输入时间', placeholder: '请选择输入时间', prop: 'issuanceDate'}
          ],
          searcher: {
            customProductName: '',
            customProductNo: '',
            issuanceDate:''
          },
          //字段绑定
          titleData: [
            {label: '原料图片', width: 100, prop: 'enterpriseName'},
            {label: '原料型号',width: 100, prop: 'manufactureOrg'},
            {label: '原料名称',width: 100, prop: 'detectionResult'},
            {label: '类型',width: 50, prop: 'detectionDate'},
            {label: '时间',width: 100, prop: 'detectionType'},
            {label: '规格',width: 50, prop: 'detectionValue'},
            {label: '数量', prop: 'detectionWay'}
          ],
          data: [
            {enterpriseName:'123',
              manufactureOrg:1,
              detectionResult:1,
              detectionDate:1,
              detectionType:1,
              detectionValue:1,
              detectionWay:1
              // detectioner:1,
              // produceBatchNo:1,
              // serialNo:1,
              // channel:'123',state:'123',senderName:'123'
              }
              ],  // table 接收页面的数据
          filter: {},  // 数据处理
          totalNum: 0,  // 分页参数
          currentPage: 1,  // 分页参数
          ids: [],  // 批量删除使用数据

      }

  },
  methods: {
    search () {

    },
    getPage (obj) {
      this.currentPage = 1
      this.pageSize = 1
      this.search()
    },
    // 对选择的数据处理
    select (arr) {
      this.ids = []
      for (let i = 0; i < arr.length; i++) {
        this.ids.push(arr[i].id)
      }
    },
    lookDetail () {

    },
    confirm () {

    }
  }
};
</script>

<style lang="scss" scoped>
.LogisticsList {
  width: 98%;
  margin-left: 5px;
}
.main-el-col {
  background-color:#fff;
  border-radius: 5px;
}
.mian-span {
  margin-left: 10px;
}
.main-body {
margin-top: 10px;
}
</style>